/*
 * GuidanceTableView 指导意见表格
 */
import QtQuick 2.15
import QtQuick.Controls 2.15
import Qt.labs.qmlmodels 1.0
import QtGraphicalEffects 1.15

Item {
    id: root

    /* property 定义开始 */
    // 横向表头高
    property int horizontalHeaderHeight: 61
    // 反应板列数
    property int plateColCount: 6
    // 表头数据
    property var horHeaderData: ["孔位", "样本名", "检测类型", "荧光染料", "CT值", "样本浓度均值", "孔位", "样本名", "检测类型", "荧光染料", "CT值", "样本浓度均值"]
    // hover事件
    property bool isHover: true

    // 私有
    // 表头颜色数组
    property var _horHeaderColorList: ["#FFFFFF", "#EBEDFF", "#E5FFE8"]
    // 颜色计数器，记录表头，设置颜色
    property int _horHeaderColorCount: 0
    /* property 定义结束 */

    Rectangle {
        anchors.fill: parent
        color: "#C3FFFFFF"
        clip: true

        layer.enabled: true
        layer.effect: OpacityMask {
            maskSource: Rectangle {
                width: root.width
                height: root.height
                radius: 13
            }
        }

        // 横向表头
        Item {
            id: horizontalHeader
            height: horizontalHeaderHeight
            anchors.left: parent.left
            anchors.right: parent.right

            Row {
                spacing: 0

                Repeater {
                    model: horHeaderData

                    Rectangle {
                        width: 85.5
                        height: horizontalHeader.height
                        // color: "transparent"
                        border.color: "#999"
                        border.width: 1
                        clip: true

                        Component.onCompleted:  {
                            // 表头6个一组，颜色不同
                            color = _horHeaderColorList[parseInt(_horHeaderColorCount / 6)]
                            _horHeaderColorCount++
                        }

                        Text {
                            id: tableText
                            anchors.fill: parent
                            text: qsTr(modelData)
                            anchors.centerIn: parent
                            font.pixelSize: 17
                            font.family: "Alibaba PuHuiTi"
                            color: "#222"
                            clip: true
                            horizontalAlignment: Text.AlignHCenter
                            verticalAlignment: Text.AlignVCenter
                            elide: Text.ElideRight

                            // 嵌套Text，当此Text宽度超过父元素Text宽度则视为溢出，显示tooltip
                            Text {
                                id: _control
                                visible: false
                                text: parent.text
                                font.family: parent.font.family
                                font.pixelSize: parent.font.pixelSize
                            }

                            ToolTip {
                                id: tableHeaderTextToolTip
                                text: tableText.text
                            }

                            // 鼠标移入显示ToolTip
                            MouseArea {
                                enabled: isHover
                                anchors.fill: parent
                                hoverEnabled: isHover
                                onEntered: {
                                    tableHeaderTextToolTip.visible = (tableText.width < _control.width)
                                }
                                onExited: {
                                    tableHeaderTextToolTip.visible = false
                                }
                            }
                        }
                    }
                }
            }
        }

        // 表格
        TableView {
            id: tableContent
            anchors {
                fill: parent
                topMargin: horizontalHeaderHeight
            }
            clip: true
            boundsBehavior: Flickable.StopAtBounds
            columnSpacing: 0
            rowSpacing: 0

            onWidthChanged: {
                forceLayout()
            }

            onHeightChanged: {
                forceLayout()
            }

        }
    }
}
